package gui;
import javafx.scene.Group;
import control.Controller;
import javafx.scene.shape.Rectangle;
import javafx.scene.paint.Color;
import javafx.scene.Node;
import javafx.scene.text.Text;
import javafx.scene.CustomNode;
import javafx.animation.Timeline;
import javafx.animation.KeyFrame;
import javafx.animation.Interpolator;
import javafx.scene.effect.Glow;
import javafx.scene.effect.Reflection;
import javafx.scene.text.Font;
import javafx.scene.paint.LinearGradient;
import javafx.scene.paint.Stop;
import java.awt.Point;

/**
 * @author Chris
 */

public class MenuBar {
    var layouter: Layouter;
    var group: Group;
    var listener: Controller;
    var menu: MenuNode;
    var background: Rectangle;

    public function setLayouter(layouterP: Layouter) {
        this.layouter = layouterP;
    }

    public function setActionListener(controllerP: Controller) {
        this.listener = controllerP;
    }

    public function getGroup() : Group {
        initComponents();
        group = Group {
            content: [
                //shelf
                background,
                menu                
            ]
        }

        return group;
    }

    public function initComponents() {
        //Menu
        var menuRef = MenuNode {
            //spacing: layouter.menuButtonSpacing;
            //layoutY: layouter.menuPosY;
            buttons: [
                MenuButton {
                    text: "Knopf 1";
                },
                MenuButton {
                    text: "Knopf\n2"
                },
                MenuButton {
                    text: "Knopf\n3"
                },
                MenuButton {
                    text: "Knopf\n4"
                },
                MenuButton {
                    text: "Knopf\n5"
                },
                MenuButton {
                    text: "Knopf\n6"
                }
            ]
        }
        menu = menuRef;
       
        background = Rectangle {
                width: layouter.stageSize.width;
                height: layouter.menuHeight;
                x: 0;
                y: layouter.stageSize.height - layouter.menuHeight;
                fill: LinearGradient {
                    startX : 0.0
                    startY : 0.0
                    endX : 0.0
                    endY : 1.0
                    stops: [
                            Stop {
                                    color : Color.WHITESMOKE
                                    offset: 0.0
                            },
                            Stop {
                                    color : Color.DARKGRAY
                                    offset: 1.0
                            },

                    ]
            } 

        }
    }



}

public class MenuButton extends CustomNode {
    var x: Float;
    var y: Float;
    var mouseOver: Boolean;
    var text: String;
    var frameRect: Rectangle;
    var bgRect: Rectangle;
    var textNode: Text;
    public var fadeTimeline: Timeline;
    var fade: Float = 1.0;
    var nonMouseOverOpacity = 0.6;


    public override function create() : Node {
        fadeTimeline = Timeline {
            keyFrames: [
                KeyFrame {
                    time: 0ms
                    values: [
                        fade => 0.0
                    ]
                },
                KeyFrame {
                    time: 400ms
                    values: [
                        fade => 1.0 tween Interpolator.LINEAR
                    ]
                }


            ]
        }

        bgRect = Rectangle {
                width: layouter.menuButtonSize.width, height: layouter.menuButtonSize.height
                fill: Color.DARKBLUE;
                //stroke: bind if (mouseOver) then Color.YELLOW else Color.GRAY
                stroke: null


                opacity: bind if (mouseOver) {
                                fade * (1.0 - nonMouseOverOpacity) + nonMouseOverOpacity
                              } else {
                                1.0 - fade * (1.0 - nonMouseOverOpacity)
                              }

                onMouseEntered: function (ev) {
                    mouseOver = true;
                    fadeTimeline.playFromStart();
                }
                onMouseExited: function (ev) {
                    mouseOver = false;
                    fadeTimeline.playFromStart();
                }
                onMouseReleased: function (ev) {
                    listener.menuButtonClicked(text);
                }
        };

        frameRect = Rectangle {
                x: bind bgRect.x -1, y: bind bgRect.y -1
                stroke: Color.SILVER
                fill: null
                width: bgRect.width+2, height: bgRect.height+2
                effect: Glow {
                    level: bind if (mouseOver) then fade else (1.0 - fade)
                }
        };

        textNode = Text {
                x: 0, y: 0
                font: Font {
                    name: "Mael"
                    embolden: true
                    size: 16
                }

                stroke: Color.YELLOW
                fill: Color.YELLOW
                effect: Glow {
                    level: bind if (mouseOver) then fade else (1.0 - fade)
                }
                content: text;

        };

        Group {
            effect: Reflection {
                //input: Glow {
                //        level: bind if (mouseOver) then fade*0.8 else (1.0 - fade)*0.8
                }
            //}
            //scaleX: bind if (mouseOver) then 1.0 + fade*0.2 else 1.0 + (1.0 - fade

            content: [               
                bgRect,
                frameRect,
                textNode
            ]
        }
    }
}

public class MenuNode extends CustomNode {
    var buttons: MenuButton[];

    public override function create() : Node {
        var returnVal = Group { };
        for (i in [0..sizeof buttons-1]) {
            var button = buttons[i];
            // Button positionieren
            var buttonX = layouter.menuPosX + i*(layouter.menuButtonSize.width+layouter.menuButtonSpacing);
            var buttonY = layouter.menuPosY;
            button.layoutX = buttonX;
            button.layoutY = buttonY;
            
            // Text positionieren
            var buttonBounds = button.boundsInLocal;
            println("buttonBounds: {buttonBounds}");
            var textBounds = button.localToScene(button.textNode.boundsInLocal);
            println("textbounds: {textBounds}");
            button.textNode.layoutY = (buttonBounds.height/2 - textBounds.height/2)/2;
            button.textNode.layoutX = (buttonBounds.width/2 - textBounds.width/2)/2;
           
            
            
            insert button into returnVal.content;
        }
        return returnVal;
    }

}
